<template>
  <div id="contact">
    <top-bar :title="title"></top-bar>
    <div class="input_list">
      <md-field>
        <md-input-item ref="input1" placeholder="请输入紧急联系人姓名" clearable v-model="userName" maxlength="12">
          <md-icon name="drjc_contacts" slot="left"></md-icon>
        </md-input-item>
        <md-input-item ref="input2" placeholder="请输入紧急联系人电话" clearable v-model="userPhone" maxlength="11">
          <md-icon name="drjc_telephone" slot="left"></md-icon>
        </md-input-item>
      </md-field>
    </div>
    <p class="addbtn" @click="confirmBtn">确认保存</p>
  </div>
</template>
<script>
import '@/assets/svgs/drjc_contacts.svg';
import '@/assets/svgs/drjc_telephone.svg';
import { Tabs, Icon, Dialog, Field, Toast, InputItem } from 'mand-mobile';
import TopBar from '@/components/TopBar';
import Loading from '@/components/loading';
import { decryptByDESModeEBC, encryptByDESModeEBC } from '@/common/encrypt';
import http from '@/common/http';
import Utils from '@/common/pakjUtils';
export default {
  components: {
    [Tabs.name]: Tabs,
    [Icon.name]: Icon,
    [TopBar.name]: TopBar,
    [Field.name]: Field,
    [Toast.name]: Toast,
    [InputItem.name]: InputItem
  },
  data() {
    return {
      title: '编辑紧急联系人',
      userName: sessionStorage['contactName'],
      userPhone: sessionStorage['contactPhone'],
      id: sessionStorage['contactId']
    };
  },
  mounted() {
    let str = localStorage.getItem('USER_INFO');
    let userobj = JSON.parse(str);
  },
  methods: {
    // 确认保存
    confirmBtn() {
      var reg = /^1(?:3\d|4[4-9]|5[0-35-9]|6[67]|7[013-8]|8\d|9\d)\d{8}$/;
      if (!this.userName) {
        Toast({
          content: '请输入紧急联系人姓名',
          duration: 3000,
          hasMask: true
        });
        return false;
      }
      if (!this.userPhone) {
        Toast({
          content: '请输入紧急联系人电话',
          duration: 3000,
          hasMask: true
        });
        return false;
      }
      if (!reg.test(this.userPhone)) {
        Toast({
          content: '请输入正确的电话号码',
          duration: 3000,
          hasMask: true
        });
        return false;
      }
      let params = {
        id: this.id,
        name: this.userName,
        phone: this.userPhone
      };
      Loading.show();
      http.post('/pakj/passenger/updateECtPerson', params).then(res => {
        Loading.hide();
        if (res.data.code === '000000') {
          Dialog.alert({
            title: '提示',
            content: res.data.msg,
            confirmText: '确定',
            onConfirm: () => {
              this.$router.push({
                name: 'EmergencyContact'
              });
            }
          });
        } else {
          Dialog.alert({
            title: '提示',
            content: res.data.msg,
            confirmText: '确定'
          });
        }
      });
    }
  }
};
</script>
<style lang="stylus" scoped>
p {
  display: block;
  margin-block-start: 0px;
  margin-block-end: 0px;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}

#contact {
  height: 100vh;
  background-color: color-primary-background;
}

.input_list {
  padding-top: 20px;
}

.addbtn {
  height: 98px;
  line-height: 98px;
  background-color: #FF6917;
  text-align: center;
  font-size: 36px;
  color: #fff;
  margin: 124px 20px 0px 20px;
  border-radius: 10px;
}
</style>
